<template>
  <div class="page gatheringManage new-form-list">
    <StoreChoice
      ref="StoreChoice"
      :isReset="true"
      :current="[]"
      :multipleChoice="false"
      @listenToStoreSelect="getSelectStoreValue"
      :statusFilter="false"
      :hasTotal="true"
      :stylewidth="true"
    
    />
    <mt-actionsheet :actions="actions" v-model="sheetVisible"></mt-actionsheet>
    <div class="scroll-view">
      <customHeader :middleTitle="this.title" />
      <div class="page-body">
        <noData msg="暂未开通支付" v-if="!loadding&&cardList.length===0" />
        <ul class="card-list">
          <li v-for="(c,i) in cardList" :key="i" :class="getCardColr(i)">
            <div class="zl" v-if="c.payChannel==11">
              <div class="top">
                <div class="card-name">
                  支付宝
                  <div class="merchant">默认收款账户</div>
                </div>
                <div class="pay-type">
                  <i class="zhk-detail_zfb"></i>
                </div>
              </div>
              <div class="bottom">
                <div class="center-text">收款结算到老板支付宝账户余额；资金是即时到账，您可以在支付宝客户端查询余额到账情况。</div>
                <div class="bottom-text">实时到账</div>
              </div>
            </div>
            <div class="zl" v-if="c.payChannel==3||c.payChannel==4">
              <div class="top">
                <div class="card-name">
                  微信
                  <div class="merchant">默认收款账户</div>
                </div>
                <div class="pay-type">
                  <i class="zhk-detail_wx"></i>
                </div>
              </div>
              <div class="bottom">
                <div class="center-text">如需要变更您的微信收款账号信息，请致电客服或者联系您的客户经理。</div>
                <div class="bottom-text">商户平台：http://pay.weixin.qq.com</div>
              </div>
            </div>
            <div class="zl" v-if="c.yinLian==2">
              <div class="top">
                <div class="card-name">
                  POS刷卡
                  <div class="merchant"></div>
                </div>
                <div class="pay-type">
                  <i class="zhk-detail_yl"></i>
                </div>
              </div>
              <div class="bottom">
                <div class="center-text">如需要变更您的银联支付账号信息，请致电客服或者联系您的客户经理。</div>
                <div class="bottom-text">核账链接：https://vsp.allinpay.com/</div>
              </div>
            </div>
            <div v-if="c.payChannel!=3&&c.payChannel!=4&&c.payChannel!=11&&c.yinLian!=2" @click.stop="openActionsheet(c)">
              <div class="top">
                <div class="card-name">
                  {{c.bankName}}
                  <div class="merchant">{{c.bankCertName}}</div>
                </div>
                <div class="card-num">
                  {{bandCardNoFormate(c.bandCardNo)}}
                  <i class="zhk-list_rarrow"></i>
                </div>
              </div>
              <div class="bottom">
                <ul class="pay-way" v-for="(m,i2) in c.merchantInfoModels" :key="i2">
                  <li v-for="(p,i3) in m.payTypeInfo" :key="i3">
                    <span>
                      <i :class="payTypeFormate(p.type).icon"></i>
                      <span class="pay-name">{{payTypeFormate(p.type).name}}</span>
                      <span
                        class="tag"
                        v-if="p.activityStatus==1"
                        @click.stop="showModal('model1',{activityEndTime:p.activityEndTime})"
                      >鼓励金</span>
                    </span>
                    <div class="feeList">
                      <ul>
                        <li v-for="(fee,i4) in p.feeModelList" :key="i4">
                          <span v-if="fee.bankCardType">{{bandCardTypeFormate(fee.bankCardType)}}：</span>
                          <span v-if="fee.isJieTiRate == 'T'">
                            {{`单笔金额≤ ${fee.unitPrice}元 费率${toPercent(fee.feeValue)}`}}
                            <br />
                            {{`单笔金额＞${fee.unitPrice}元 费率${toPercent(fee.feeUpValue)}`}}
                          </span>
                          <span v-else>{{`费率${toPercent(fee.feeValue)}`}}</span>
                        </li>
                      </ul>
                    </div>
                  </li>
                </ul>
              </div>
            </div>
          </li>
        </ul>
        <div class="unopen">
          <template v-if="unopenPayList&&unopenPayList.length>0">
            <div class="title">待开通收款方式</div>
            <ul class="pay-way">
              <li v-for="(payType,index) in unopenPayList" :key="index">
                <i :class="payTypeFormate(payType).icon"></i>
                <div class="pay-name">{{payTypeFormate(payType).name}}</div>
              </li>
            </ul>
          </template>
          <div class="link-wrap">
            <div class="tip">使用过程中遇到问题, 可致电客服或联系销售经理</div>
            <ul class="link-btn-list">
              <li @click="callUp('4006969619')">联系客服</li>
              <li @click="callUp(mobile)">联系经理</li>
            </ul>
          </div>
        </div>
        <!-- <div class="item border-bt-all">
          <div class="item-t">
            <div class="lft">
              <span class="zhk-zfb icon"></span>
              <span class="name">支付宝</span>
              <span
                class="val"
                v-if="data.aLiPay.payChannel!=11&&(data.aLiPay.status===1||data.aLiPay.status===2||data.aLiPay.status===4)"
              >
                （费率：
                <span class="rate">{{data.aLiPay.rate}}</span>
                <span
                  v-if="data.aLiPay.isJieTiRate == 'T'"
                  class="rate"
                >{{'~'+data.aLiPay.feeUpValue}}</span>）
              </span>
              <span
                class="zhk-ts"
                @click="showModal('model1',{isJieTiRate: data.aLiPay.isJieTiRate,rate: data.aLiPay.rate,expiryTime:data.aLiPay.expiryTime,unitPrice:data.aLiPay.unitPrice,feeUpValue:data.aLiPay.feeUpValue,activityStatus:data.aLiPay.activityStatus,activityEndTime:data.aLiPay.activityEndTime})"
                v-if="(data.aLiPay.expiryTime ||(data.aLiPay.activityStatus == 1&&data.aLiPay.activityEndTime))&&data.aLiPay.rate!='0.55%'"
              ></span>
            </div>
            <div
              class="rght"
              :class="statusColor(data.aLiPay.status)"
            >{{statusFormate(data.aLiPay.status)}}</div>
          </div>
          <div class="err-msg" v-if="data.aLiPay.status===5&&data.aLiPayMsg">原因：{{data.aLiPayMsg}}</div>
          <div
            class="item-b"
            v-if="data.aLiPay.payChannel==11"
          >收款结算到老板支付宝账户余额；资金是即时到账，您可以在支付宝客户端查询余额到账情况。</div>
          <div
            class="item-b"
            v-if="data.aLiPay.payChannel!=11&&(data.aLiPay.status===1||data.aLiPay.status===2||data.aLiPay.status===4)"
            @click="toDetails(data.aLiPay.type,data.aLiPayStatus,data.aLiPayMsg,data['aLiChangeModel'])"
          >
            <div class="flex-box">
              <span class="account">
                商户号
                <br />
                <i>{{data.aLiPay.merchantId}}</i>
              </span>
              <span class="zhk-list_rarrow icon"></span>
            </div>
          </div>
          <div class="item-b" v-if="data.aLiPay.status===0" @click="toOpen('2')">
            <div class="open-btn">
              <span>立即开通</span>
              <i class="zhk-list_rarrow"></i>
            </div>
          </div>
          <div class="item-b" v-if="data.aLiPay.status===5" @click="toOpen('2')">
            <div class="open-btn">
              <span>重新编辑</span>
              <i class="zhk-list_rarrow"></i>
            </div>
          </div>
        </div>
        <div class="item border-bt-all">
          <div class="item-t">
            <div class="lft">
              <span class="zhk-wx icon wx"></span>
              <span class="name">微信</span>
              <span
                class="val"
                v-if="data.weiXin.payChannel!=3&&data.weiXin.payChannel!=4&&(data.weiXin.status===1||data.weiXin.status===2||data.weiXin.status===4)"
              >
                （费率：
                <span class="rate">{{data.weiXin.rate}}</span>
                <span
                  v-if="data.weiXin.isJieTiRate == 'T'"
                  class="rate"
                >{{'~'+data.weiXin.feeUpValue}}</span>）
              </span>
              <span
                class="zhk-ts"
                @click="showModal('model1',{isJieTiRate: data.weiXin.isJieTiRate,rate: data.weiXin.rate,expiryTime:data.weiXin.expiryTime,unitPrice:data.aLiPay.unitPrice,feeUpValue:data.aLiPay.feeUpValue,activityStatus:data.weiXin.activityStatus,activityEndTime:data.weiXin.activityEndTime})"
                v-if="(data.weiXin.expiryTime ||(data.weiXin.activityStatus == 1&&data.weiXin.expiryTime))&&data.weiXin.rate!='0.55%'"
              ></span>
            </div>
            <div
              class="rght"
              :class="statusColor(data.weiXin.status)"
            >{{statusFormate(data.weiXin.status)}}</div>
          </div>
          <div class="err-msg" v-if="data.weiXin.status===5&&data.weiXinMsg">原因：{{data.weiXinMsg}}</div>
          <div
            class="item-b"
            v-if="data.weiXin.payChannel==3||data.weiXin.payChannel==4"
          >如需要变更您的微信收款账号信息，请致电客服或者联系您的客户经理。商户平台：http://pay.weixin.qq.com</div>
          <div
            class="item-b"
            v-if="data.weiXin.payChannel!=3&&data.weiXin.payChannel!=4&&(data.weiXin.status===1||data.weiXin.status===2||data.weiXin.status===4)"
            @click="toDetails(data.weiXin.type,data.weiXinStatus,data.weiXinMsg,data['weiXinChangeModel'])"
          >
            <div class="flex-box">
              <span class="account">
                商户号
                <br />
                <i>{{data.weiXin.merchantId}}</i>
              </span>
              <span class="zhk-list_rarrow icon"></span>
            </div>
          </div>
          <div class="item-b" v-if="data.weiXin.status===0" @click="toOpen('5')">
            <div class="open-btn">
              <span>立即开通</span>
              <i class="zhk-list_rarrow"></i>
            </div>
          </div>

          <div class="item-b" v-if="data.weiXin.status===5" @click="toOpen('5')">
            <div class="open-btn">
              <span>重新编辑</span>
              <i class="zhk-list_rarrow"></i>
            </div>
          </div>
        </div>
        <div class="item border-bt-all">
          <div class="item-t">
            <div class="lft">
              <span class="zhk-yl icon yl"></span>
              <span class="name">银联</span>
            </div>
            <div class="rght" :class="bankColor(data.yinLian)">{{bankFormate(data.yinLian)}}</div>
          </div>
          <div class="item-b" v-if="data.yinLian===2">
            如需要变更您的银联支付账号信息，请致电客服或者联系您的客户经理。
            <p class="link">核账链接：https://vsp.allinpay.com/</p>
          </div>
          <div class="item-b" v-else @click="callUp('4006969619')">
            如需开通银联支付，请致电客服或联系销售经理。
            <br />客户服务热线：
            <span class="phone-num">400-696-9619</span>
          </div>
        </div>-->
      </div>
    </div>
    <div class="feel-warn-modl" @click="agencyEvent">
      <hintModal ref="model1" ttHtml="提示" footerHtml="知道了">
        <div>
          <div class="ct1">商户运营鼓励金</div>
          <div class="ct2">有效期截止到{{modalInfo.activityEndTime}}，到期后费率及费率到期时间不变，但不再享受商户运营鼓励金</div>
        </div>
      </hintModal>
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import customHeader from "../../components/header/header";
import hintModal from "../../components/hintModal/hintModal";
import { Toast, MessageBox } from "mint-ui";
import jsBridge from "../../tools/jsBridge";
import noData from "../../components/noData/noData";
import localStorageClient from "../../js/localstorage.js";
import moment from "moment";
import StoreChoice from "../../components/StoreChoice/StoreChoice";
export default {
  name: "gatheringManage",
  data() {
    return {
      loadding: false,
      title:"收款账户管理",
      unopenPayList: [],//未开通的支付方式
      cardColr: ["blue", "red", "green", "purple"],
      cardList: [],
      mobile: "",
      //开通渠道（payChannel字段）
      //  CITIC_WECHAT(0,"中信微信"),
      //   UNIONPAY(1,"银联"),// 已废弃：此字段在线上无数据（压根儿就没有银联）
      //   ANT_WECHAT(2,"网商"),
      //   LANJING_WECHAT(3,"蓝鲸"),// 微信的直连通道
      //   YUNZONG_WECHAT(4,"总部"),// 总部直连
      //   ALI_FACETOFACE(11,"支付宝当面付"),// 富友二期将当面付作为一个渠道存入渠道表
      //   FU_YOU(5,"富友"),
      //   WLT_WECHAT(6,"沃雷特");// 已废弃：此类型原来要做，后未做（做的是蓝鲸和总部）
      //开通状态(status字段)
      //NO(0,"未开通"),
      //OPEN(1,"已开通"),
      //FROZEN(2,"已冻结"),
      // APPLICATION(3,"申请中"),
      // CLOSE(4,"已关闭"),
      // FAIL(5,"开通失败");
      modalInfo: {},
      shopId: "",
      data: {
        aLiPay: {
          channelType: null,
          expiryTime: null,
          feeUpValue: null,
          isJieTiRate: "",
          merchantId: "",
          payChannel: 2,
          paymentAccount: "",
          paymentPeople: "",
          rate: "",
          settlement: "",
          status: null,
          type: null,
          unitPrice: null
        },
        weiXin: {
          channelType: null,
          expiryTime: null,
          feeUpValue: null,
          isJieTiRate: "",
          merchantId: "",
          payChannel: null,
          paymentAccount: "",
          paymentPeople: "",
          rate: "",
          settlement: "",
          status: null,
          type: null,
          unitPrice: null
        }
      },
      sheetVisible: false,
      actions: [],
    };
  },
  methods: {

            //门店选择回调
            getSelectStoreValue(value, storeName) {
    console.log(value[0]. selectKey,storeName);
    this.loadding = true;
      this.ajax({
        type: "get",                                        
        url: "/newapp/AppMerchant/sortBankCard.do?shopId=" + value[0]. selectKey,
        controlLoading: true
      })
        .then(res => {
          this.loadding = false;
          if (res.success) {
            // let dataList = res.resultObject;
            // for (let m of dataList) {
            //   //m["payChannel"] = null;
            //   m["payType"] = null;
            //   if(m.merchantInfoModels){
            //     for (let p of m.merchantInfoModels) {
            //       for (const i of p.payTypeInfo) {
            //         // if (i['payChannel']) {
            //         //   m["payChannel"] = i.payChannel;
            //         // }
            //         if (i['type']) {
            //           m["payType"] = i.type;
            //         }
            //       }
            //     }
            //   }

            // }
            // this.cardList = dataList;
            this.cardList = res.resultObject;
            // this.data = res.resultObject;
            // this.data.aLiPay.expiryTime = this.expiryTimeFormate(
            //   res.resultObject.aLiPay.expiryTime
            // );
            // this.data.weiXin.expiryTime = this.expiryTimeFormate(
            //   res.resultObject.weiXin.expiryTime
            // );
            // this.data.aLiPay.rate = this.toPercent(this.data.aLiPay.rate);
            // this.data.aLiPay.feeUpValue = this.toPercent(
            //   this.data.aLiPay.feeUpValue
            // );
            // this.data.weiXin.rate = this.toPercent(this.data.weiXin.rate);
            // this.data.weiXin.feeUpValue = this.toPercent(
            //   this.data.weiXin.feeUpValue
            // );
          } else {
            Toast(res.msg);
          }
          this.setUnopenPayList();

        })
        .catch(err => {
          this.setUnopenPayList();
          this.loadding = false;
        });
    },
    //未开通支付方式
    setUnopenPayList() {
      const allPayType = [2, 4, 5, 7];//全部支付方式
      let curr = [];//已开通的支付方式
      let unopen = [];//未开通的支付方式
      for (const card of this.cardList) {
        if(card.payChannel==11){
           curr.push(2);
        }
        if(card.payChannel==3||card.payChannel==4){
           curr.push(5);
        }
        if (card.merchantInfoModels) {
          for (const merchant of card.merchantInfoModels) {
            for (const payType of merchant.payTypeInfo) {
              curr.push(payType.type);
            }
          }
        }
      }
      for (const p of allPayType) {
        (!curr.includes(p)) && unopen.push(p);
      }
      this.unopenPayList = unopen;
    },
    getCardColr(index) {
      let i = index > 3 ? index - 3 : index;
      return this.cardColr[i];
    },
    // styleFormate(e) {
    //   return `background:${e.color};`;
    // },
    // cardToggle(index) {
    //   const len = this.cardList.length - 1;
    //   this.cardList.map((item, i) => {
    //     if (index == i) {
    //       if (i == len) {
    //         item.visible = true;
    //       } else {
    //         item.visible = !item.visible;
    //       }

    //     } else {
    //       if (i == len) {
    //         item.visible = true;
    //       } else {
    //         item.visible = false;
    //       }
    //     }
    //     return item;
    //   });
    // },
    openActionsheet(c) {
      if (c.merchantInfoModels.length > 1) {
        this.actions = c.merchantInfoModels.map((item) => {
          item.name = this.payTypeName(item.payTypeInfo);
          item.method = this.handleAction;
          item.merchantId = item.merchantId;
          return item;
        });
        this.sheetVisible = true;
      } else if (c.merchantInfoModels.length > 0) {
        const merchantInfoModel = c.merchantInfoModels[0];
        this.toDetails(merchantInfoModel['merchantId'], merchantInfoModel['changeModel']);
      }
    },
    handleAction(merchantInfoModel) {
      this.toDetails(merchantInfoModel['merchantId'], merchantInfoModel['changeModel']);
    },
    payTypeName(payType) {
      let name = "";
      payType.map((p, i) => {
        let split = i > 0 ? "+" : "";
        if (p.type == 2) {
          name += split + "支付宝";
        } else if (p.type == 4) {
          name += split + "POS刷卡";
        } else if (p.type == 5) {
          name += split + "微信";
        } else if (p.type == 7) {
          name += split + "云闪付";
        }
      });
      return name;
    },
    payTypeFormate(payType) {
      let v = { name: "", icon: "" };
      if (payType == 2) {
        v.name = "支付宝";
        v.icon = "zhk-detail_zfb";
      } else if (payType == 4) {
        v.name = "POS刷卡";
        v.icon = "zhk-detail_yl";
      } else if (payType == 5) {
        v.name = "微信";
        v.icon = "zhk-detail_wx";
      } else if (payType == 7) {
        v.name = "云闪付";
        v.icon = "zhk-detail_ysf";
      }
      return v;
    },
    callUp(tel) {
      if (!tel) {
        Toast("未获取到手机号");
        return;
      }
      jsBridge.callUp({
        tel: tel
      });
    },
    //跳转到收款账户详情
    toDetails(merchantId, changeModel) {
      //短信验证
      const smsCache = localStorageClient.load("sms", 120);
      if (!smsCache) {
        this.$router.push({
          path: "/SMSVerification",
          query: { nextPath: "/storeManage/gatheringManage/gatheringAccountDel", shopId: this.shopId, merchantId: merchantId }
        });
        return;
      }
      this.$router.push({
        path: "/storeManage/gatheringManage/gatheringAccountDel",
        query: { shopId: this.shopId, merchantId: merchantId }
      });
    },

    //费率弹窗
    showModal(refsName, data) {
      this.modalInfo = data;
      this.modalInfo.activityEndTime = this.modalInfo.activityEndTime ? moment(this.modalInfo.activityEndTime).format('YYYY-MM-DD') : '';
      this.$refs[refsName].popupShow();
    },
    agencyEvent(event) {
      if (event.target.className == "xieyi") {
        this.$router.push({
          path: "/storeManage/gatheringManage/rateProtocol"
        });
      }
    },

    //状态显示
    statusFormate(status) {
      let s = "";
      if (status == 0) {
        s = "未开通";
      } else if (status == 1) {
        s = "已开通";
      } else if (status == 2) {
        s = "已冻结";
      } else if (status == 3) {
        s = "审核中";
      } else if (status == 4) {
        s = "已关闭";
      } else if (status == 5) {
        s = "开通失败";
      }
      return s;
    },
    //状态颜色
    statusColor(status) {
      let s = "";
      if (status == 0) {
        s = "unopen";
      } else if (status == 3) {
        s = "validating";
      } else if (status == 1) {
        s = "opened";
      } else if (status == 5 || status == 4 || status == 2) {
        s = "failed";
      }
      return "status-" + s;
    },
    //银联状态显示
    bankFormate(status) {
      let s = "";
      if (status == 0) {
        s = "未开通";
      } else if (status == 1) {
        s = "申请中";
      } else if (status == 2) {
        s = "已开通";
      }
      return s;
    },
    //银联状态颜色
    bankColor(status) {
      let s = "";
      if (status == 0) {
        s = "unopen";
      } else if (status == 1) {
        s = "validating";
      } else if (status == 2) {
        s = "opened";
      }
      return "status-" + s;
    },
    //小数转百分比
    toPercent(rate) {
      if (rate) {
        return (parseFloat(rate) * 1000000 * 100) / 1000000 + "%";
      } else {
        return rate;
      }
    },
    //费率到期时间
    expiryTimeFormate(expiryTime) {
      if (expiryTime === 0) {
        return "长期";
      } else if (expiryTime == null || undefined == expiryTime) {
        return null;
      } else {
        return CommonUtil.timestampToTime(expiryTime);
      }
    },
    bandCardNoFormate(num) {
      let v = num;
      if (num && num.length >= 4) {
        v = "**** " + num.substr(-4)
      }
      return v;
    },
    bandCardTypeFormate(type) {
      return CommonUtil.bandCardTypeFormate(type);
    },
    initModel(shopId) {
      this.loadding = true;
      this.ajax({
        type: "get",
        url: "/newapp/AppMerchant/sortBankCard.do?shopId=" + shopId,
        controlLoading: true
      })
        .then(res => {
          this.loadding = false;
          if (res.success) {
            // let dataList = res.resultObject;
            // for (let m of dataList) {
            //   //m["payChannel"] = null;
            //   m["payType"] = null;
            //   if(m.merchantInfoModels){
            //     for (let p of m.merchantInfoModels) {
            //       for (const i of p.payTypeInfo) {
            //         // if (i['payChannel']) {
            //         //   m["payChannel"] = i.payChannel;
            //         // }
            //         if (i['type']) {
            //           m["payType"] = i.type;
            //         }
            //       }
            //     }
            //   }

            // }
            // this.cardList = dataList;
            this.cardList = res.resultObject;
            // this.data = res.resultObject;
            // this.data.aLiPay.expiryTime = this.expiryTimeFormate(
            //   res.resultObject.aLiPay.expiryTime
            // );
            // this.data.weiXin.expiryTime = this.expiryTimeFormate(
            //   res.resultObject.weiXin.expiryTime
            // );
            // this.data.aLiPay.rate = this.toPercent(this.data.aLiPay.rate);
            // this.data.aLiPay.feeUpValue = this.toPercent(
            //   this.data.aLiPay.feeUpValue
            // );
            // this.data.weiXin.rate = this.toPercent(this.data.weiXin.rate);
            // this.data.weiXin.feeUpValue = this.toPercent(
            //   this.data.weiXin.feeUpValue
            // );
          } else {
            Toast(res.msg);
          }
          this.setUnopenPayList();

        })
        .catch(err => {
          this.setUnopenPayList();
          this.loadding = false;
        });
    },
    getShopPersonBaseInfo() {
      this.ajax({
        type: "get",
        url: "/newapp/AppMerchant/getShopPersonBaseInfo.do?shopId=" + this.$route.query.shopId,
        controlLoading: false
      })
        .then(res => {
          if (res.success) {
            this.mobile = res.resultObject.mobile;
          } else {
            Toast(res.msg);
          }
        })
        .catch(err => {
        });
    },
  },
  created() {
    this.shopId = this.$route.query.shopId;
    this.initModel(this.$route.query.shopId);
    this.getShopPersonBaseInfo();
  },
  mounted(){
    if(!this.$route.query.shopId){
      this.$refs.StoreChoice.popupShow();
      console.log(this.$route);
      this.title=this.$route.query.title
    }
 
  },
  // beforeRouteLeave(to, from, next) {
  //   if(to.name==="SMSVerification"&&to.query.nextPath===this.$route.path){
  //       next({path: '/storeManage'});
  //   }else{
  //     next();
  //   }
  // },
  components: {
    customHeader,
    hintModal,
    noData,
    StoreChoice
  }
};
</script>
  <style lang='scss' scoped>
@import "gatheringManage";
</style>
  <style lang='scss' >
@import "../../style/public";
.gatheringManage {
  .feel-warn-modl {
    .ct1 {
      @include remCalc(font-size, 28);
      @include remCalc(line-height, 40);
      @include remCalc(margin-bottom, 11);
      a {
        color: #ee3a31;
      }
    }
    .ct2 {
      color: #999999;
      @include remCalc(margin-bottom, 20);
      @include remCalc(font-size, 22);
      @include remCalc(line-height, 30);
      .xieyi {
        color: #459dff;
      }
    }
  }
  .card-slide {
    transition: height 0.25s;
  }
}
</style>
